/*
 * @Author: Jimmy
 * @LastModifiedBy: Jimmy
 * @Date: 2024-06-26 18:55:04
 * @LastEditTime: 2024-07-07 15:13:37
 * @FilePath: /nest_study/web/src/views/system/dept/components/info.tsx
 */
/*
 * @Author: Jimmy
 * @LastModifiedBy: Jimmy
 * @Date: 2024-06-23 12:37:05
 * @LastEditTime: 2024-06-25 20:58:59
 * @FilePath: /nest_study/web/src/views/system/role/components/info.tsx
 */

import DrawerWrapper from "@/components/drawer_wrapper"
import { Form, Input, InputNumber, message, TreeSelect } from "antd"
import { TDeptInfo } from "../index.type";
import { useEffect, useState } from "react";
import { remoteList, addInfo, updateInfo } from "@/api/system/dept";
import { rules } from "./rules";

const ShowInfo = (props: any) => {
    let { info } = props;
    let initForm: TDeptInfo = {
        name: '',
        parentId: -1,
        sort: 0,
        leader: '',
        phone: '',
        email: '',
    }
    const [form] = Form.useForm<any>();
    const [infoForm, _setInfoForm] = useState<TDeptInfo>({ ...initForm, ...info });
    //部门列表
    const [deptList, setDeptList] = useState<TDeptInfo[]>([]);

    useEffect(() => {
        remoteBaseResource()
    }, [])
    //提交
    const submit = async () => {
        form.validateFields().then(async values => {
            let info = { ...infoForm, ...values };
            if (info.id) {
                await updateInfo(info);
            } else {
                await addInfo(info);
            }
            message.success('操作成功');
            form.resetFields();
            props.submit();
        }).catch(info => {
            console.log('Validate Failed - ', info);
        });
    }
    //获取所有部门
    const remoteBaseResource = async () => {
        try {
            let deptResult = await remoteList({ page: 1, size: 100 });
            let list: TDeptInfo[] = deptResult.data.list
            let dataList: TDeptInfo[] = [
                {
                    id: -1,
                    parentId: -9999,
                    name: '顶级部门',
                    children: [...list]
                }
            ]
            setDeptList(dataList);
        } finally { }
    }
    return (
        <DrawerWrapper
            title="职位信息"
            close={() => props.close()}
            submit={() => submit()}
        >
            <Form
                form={form}
                name="info"
                labelCol={{ span: 5 }}
                wrapperCol={{ span: 17 }}
                initialValues={{ remember: false }}
                onFinish={submit}
                autoComplete="off"
            >
                <Form.Item label="上级部门" initialValue={infoForm.parentId} name="parentId" rules={rules.parentId}>
                    <TreeSelect
                        showSearch
                        allowClear
                        treeDefaultExpandAll
                        style={{ width: '100%' }}
                        placeholder="请选择部门"
                        showCheckedStrategy={"SHOW_PARENT"}
                        treeData={[...deptList]}
                        fieldNames={{
                            label: 'name',
                            value: 'id'
                        }}
                    />
                </Form.Item>
                <Form.Item label="部门名称" initialValue={infoForm.name} name="name" rules={rules.name}>
                    <Input allowClear placeholder="请输入部门名称" />
                </Form.Item>
                <Form.Item label="部门负责人" initialValue={infoForm.leader} name="leader" rules={rules.leader}>
                    <Input allowClear placeholder="请输入部门负责人" />
                </Form.Item>
                <Form.Item label="联系电话" initialValue={infoForm.phone} name="phone" rules={rules.phone}>
                    <Input allowClear maxLength={11} placeholder="请输入联系电话" />
                </Form.Item>
                <Form.Item label="邮箱" initialValue={infoForm.email} name="email">
                    <Input allowClear placeholder="请输入邮箱" />
                </Form.Item>
                <Form.Item label="排序" initialValue={infoForm.sort} name="sort" rules={rules.sort}>
                    <InputNumber min={0} precision={0} style={{ width: '100%' }} placeholder="请输入排序" />
                </Form.Item>
            </Form>
        </DrawerWrapper>
    )
}

export default ShowInfo